/*
Title:      	AltFontPrev
Author:     	Sam Rayner
More Info: 		http://samrayner.com/archives/altfontprev/
*/

var Details = {
  version: "0.2",
  releaseDate: "8th July 08"
}

var Core = {
  snatchClass: function(target, theClass, altClass) {
    var siblings = target.parentNode.childNodes;
    
    for(var i = 0; i < siblings.length; i++) {
       siblings[i].className = altClass;
    }
    
    target.className = theClass;
  }
}

var Retrieve = {
  fonts: [],
  selectors: [],
  
  fill: function() {    
    var selNum = 0;
    
    for(var i = 0; i < document.styleSheets.length; i++) {
      for(var j = 0; j < document.styleSheets[i].cssRules.length; j++) {
        var fontFam = document.styleSheets[i].cssRules[j].style.getPropertyValue("font-family");
      
        if(fontFam) {
          Retrieve.selectors[selNum] = document.styleSheets[i].cssRules[j].selectorText;
          var indFonts = fontFam.split(",");
          Retrieve.fonts[selNum] = new Array(indFonts.length - 1);
          
          for(var fontNum = 0; fontNum < indFonts.length; fontNum++) {
            indFonts[fontNum] = indFonts[fontNum].replace(/^\s+|'+|"+|\s+$|"+$|'+$/g,"");
            Retrieve.fonts[selNum][fontNum] = indFonts[fontNum].toLowerCase();
          }
          selNum++;
        }
      }
    }
  }
}

var Insert = {
  cssLink: function() {
    linkElement = document.createElement("link");
    linkElement.id = "afp-css"
    linkElement.rel = "stylesheet";
    linkElement.type = "text/css";
		linkElement.href = "../afp.css";
    document.getElementsByTagName("head")[0].appendChild(linkElement);
  },
  
  afpCode: function() {
    var divElement = document.createElement('div');
	divElement.id = "altfontprev";
	
	divElement.innerHTML = [
	'<p id="afp-title"><span></span>AltFontPrev</p>',
	'<form><label for="selector">Selector:</label>',
	'<select name="selector" id="afp-selectors"></select>',
	'</form><ul id="afp-fontlists"></ul>',
	'<form><label for="afp-input">Custom:</label><input id="afp-input" type="search" value="Custom Font"></input></form>',
	'<ol id="afp-custom"></ol>',
	'<img id="afp-closeicon" src="http://files.samrayner.com/scripts/altfontprev/images/close.png" width="13" height="13" alt="Close" title="Close" />',
	'<img id="afp-infoicon" src="http://files.samrayner.com/scripts/altfontprev/images/info.png" width="13" height="13" alt="Info" title="Info" />',
	'<div id="afp-info" class="afp-hide"><span></span>',
	'<p>v.' + Details.version + '<em>(' + Details.releaseDate + ')</em></p>',
	'<p>Created by <a href="http://samrayner.com/">Sam Rayner</a></p><p><a target="_blank" href="http://samrayner.com/archives/altfontprev/">More Info&hellip;</a></p></div></div>'
	].join('');
	
	document.getElementsByTagName("body")[0].appendChild(divElement);
  },
  
  selDropdown: function(dest) {
    for(var selNum = 0; selNum < Retrieve.selectors.length; selNum++) {
      var optionElement = document.createElement("option"); 
      var optionText = document.createTextNode(Retrieve.selectors[selNum]);
      document.getElementById(dest).appendChild(optionElement);
      document.getElementById(dest).lastChild.appendChild(optionText);
    }
  },
  
  fontLists: function(dest) {
    for(var selNum = 0; selNum < Retrieve.selectors.length; selNum++) {
      var outerLiElement = document.createElement("li");
      var olElement = document.createElement("ol");
      document.getElementById(dest).appendChild(outerLiElement);
      document.getElementById(dest).lastChild.appendChild(olElement); 
    
      for(var fontNum = 0; fontNum < Retrieve.fonts[selNum].length; fontNum++) {
        var innerLiElement = document.createElement("li");    
        innerLiElement.style.fontFamily = Retrieve.fonts[selNum][fontNum] + ",helvetica";
      
        var aElement = document.createElement("a");
        aElement.href = "#" + Retrieve.fonts[selNum][fontNum].replace(/^[\s]/g,"_");
      
        if(fontNum % 2 == 0) {
          aElement.className = "afp-stripe";
        }
        
        var fontName = Retrieve.fonts[selNum][fontNum];

        if(fontName == "serif" 
           || fontName == "sans-serif" 
           || fontName == "cursive" 
           || fontName == "fantasy" 
           || fontName == "monospace") {
          fontName = "default " + fontName;
        }
        
        var spanElement = document.createElement("span"); 
        spanElement.style.fontFamily = Retrieve.fonts[selNum][fontNum] + ",wingdings,impact"
        
        var aText = document.createTextNode(fontName);
        var spanText = document.createTextNode("o");
        
        document.getElementById(dest).lastChild.lastChild.appendChild(innerLiElement);
        document.getElementById(dest).lastChild.lastChild.lastChild.appendChild(aElement);
        document.getElementById(dest).lastChild.lastChild.lastChild.lastChild.appendChild(aText);
        document.getElementById(dest).lastChild.lastChild.lastChild.lastChild.appendChild(spanElement);
        document.getElementById(dest).lastChild.lastChild.lastChild.lastChild.lastChild.appendChild(spanText);
      }
    }
  },
  
/*
  customFont: function(fontName) {
    var selIndex = document.getElementById("afp-selectors").selectedIndex;
    var customFont = document.getElementById("afp-custom");
    
    var liElement = document.createElement("li");    
    liElement.style.fontFamily = fontName.toLowerCase() + ",helvetica";
    liElement.className = "afp-current";
      
    var aElement = document.createElement("a");
    aElement.href = "#" + fontName.toLowerCase().replace(/^[\s]/g,"%20");
    
    var spanElement = document.createElement("span"); 
    spanElement.style.fontFamily = fontName.toLowerCase() + ",wingdings,impact"
        
    var aText = document.createTextNode(fontName);
    var spanText = document.createTextNode("o");
    
    if(customFont.childNodes.length > 0) {
      customFont.removeChild(customFont.firstChild);
    }
        
    customFont.appendChild(liElement);
    customFont.lastChild.appendChild(aElement);
    customFont.lastChild.lastChild.appendChild(aText);
    customFont.lastChild.lastChild.appendChild(spanElement);
    customFont.lastChild.lastChild.lastChild.appendChild(spanText);
  },
*/
  
  error: function() {
    var selSelect = document.getElementById("afp-selectors");
    selSelect.disabled = true;
    
    var customInput = document.getElementById("afp-input");
    customInput.disabled = true;
    
    var optionElement = document.createElement("option"); 
    optionText = document.createTextNode("Uh oh.");
    
    selSelect.appendChild(optionElement);
    selSelect.lastChild.appendChild(optionText);
    
    var liElement = document.createElement("li");
    liElement.id = "afp-error";
    
    var liText = document.createTextNode("Looks like there are no fonts declared...");
    
    var fontLists = document.getElementById("afp-fontlists");
    fontLists.appendChild(liElement);
    fontLists.lastChild.appendChild(liText);
  }
}

var Action = {
  selChange: function(selIndex) {
    var fontList = document.getElementById("afp-fontlists").childNodes[selIndex];
    Core.snatchClass(fontList, "afp-show", "afp-hide")
    
/*     Insert.customFont(""); */
  },

  fontChange: function(selected) {
/*     Insert.customFont(""); */
  
    Core.snatchClass(selected, "afp-current", "");
    
    var selIndex = document.getElementById("afp-selectors").selectedIndex;
    var liArray = selected.parentNode.childNodes;
	
	for(var i = 0; i < liArray.length; i++) {
	  if(liArray[i] == selected) {
	    var fontIndex = i;
	  }
	}

	var lastSheet = document.styleSheets[document.styleSheets.length - 1];

    var newRule = Retrieve.selectors[selIndex] + " {font-family: " + Retrieve.fonts[selIndex][fontIndex];
    
    for(var i = 0; i < Retrieve.fonts[selIndex].length; i++) {
      newRule += "," + Retrieve.fonts[selIndex][i];
    }
    
    newRule += "}";
    
    lastSheet.insertRule(newRule, lastSheet.cssRules.length);
  }
  
/*
  customChange: function(fontName) {
    var selIndex = document.getElementById("afp-selectors").selectedIndex;
    var customFont = document.getElementById("afp-custom").lastChild;
    var fontList = document.getElementById("afp-fontlists");
    
    for(var i = 0; i < Retrieve.fonts[selIndex].length; i++) {
      fontList.childNodes[selIndex].firstChild.childNodes[i].className = "";
    }
    
    var lastSheet = document.styleSheets[document.styleSheets.length - 1];

    var newRule = Retrieve.selectors[selIndex] + " {font-family: " + fontName.toLowerCase();
    
    for(var i = 0; i < Retrieve.fonts[selIndex].length; i++) {
      newRule += "," + Retrieve.fonts[selIndex][i];
    }
    
    newRule += "}";
    
    lastSheet.insertRule(newRule, lastSheet.cssRules.length);
  }
*/
}
  
var Listener = {
  selSelect: function() {
    var selIndex = document.getElementById("afp-selectors").selectedIndex;
    Action.selChange(selIndex);
  },

  fontClick: function() {
    Action.fontChange(this);
  },
  
/*
  customSubmit: function(event) {
    var customValue = document.getElementById("afp-input").value;
    event.preventDefault();
    Insert.customFont(customValue);
    Action.customChange(customValue);
  },
*/

  closeClick: function() {
    var afpPane = document.getElementById("altfontprev");
    afpPane.parentNode.removeChild(afpPane);
    
    var afpJS = document.getElementById("afp-js");
    afpJS.parentNode.removeChild(afpJS);
    
    var afpCSS = document.getElementById("afp-css");
    afpCSS.parentNode.removeChild(afpCSS);
  },
  
  infoClick: function() {
    var afpInfo = document.getElementById("afp-info");
    
    if(afpInfo.className == "afp-hide") {
      afpInfo.className = "afp-show";
    }
    else {
      afpInfo.className = "afp-hide";
    }
  },
  
  createAll: function() {
    var selDropdown = document.getElementById("afp-selectors");
    selDropdown.addEventListener("change", Listener.selSelect, false);
    
    var fontLists = document.getElementById("afp-fontlists");
    for(var i = 0; i < fontLists.childNodes.length; i++) {
      for(var j = 0; j < fontLists.childNodes[i].firstChild.childNodes.length; j++) {
        fontLists.childNodes[i].firstChild.childNodes[j].addEventListener("click", Listener.fontClick, false);
      }
    }
  
    var customForm = document.getElementById("afp-input").parentNode;
    customForm.addEventListener("submit", Listener.customSubmit, false);
  
    var closeIcon = document.getElementById("close-icon");
    closeIcon.addEventListener("click", Listener.closeClick, false);
    
    var infoIcon = document.getElementById("info-icon");
    infoIcon.addEventListener("click", Listener.infoClick, false);
  }
}

var Load = {
  altFontPrev: function() {  
    Retrieve.fill();
    Insert.cssLink();
    Insert.afpCode();
  
    if(Retrieve.selectors.length > 0) {
      Insert.selDropdown("afp-selectors");
      Insert.fontLists("afp-fontlists");
    }  
    else {
      Insert.error();
    }
  
    Action.selChange(0);
  
    Listener.createAll();
  }
}